@import "./common.scss";

.web{
    @include web(750,1366);
    main{
        @include web(750,1000);
        margin-top: size(140);
        .box-link{
            display: flex;
            align-items: center;
            width: size(266);
            height: size(51);
            margin: 0 auto;
            position: relative;
        input{
            @include web(266,51);
            font-size: size(24);
            border-radius: size(20);
            color: gray;
            border: size(2) solid $back;
        }
        img{
            @include web(30,30);
            position: absolute;
            right: size(10);
            }
        }

        .box-grid{
            margin-top: size(40);
            .sou{
                text-align: center; 
                font-size: size(26);
            }
            .grid{
                @include web(513,133);
                display: grid;
                grid-template-columns: repeat(4,1fr);   //网格平份为4份
                grid-gap: size(5) size(9);      //网格间隔
                margin-top: size(20);
                p{  
                    @include web(125,64);
                    text-align: center;
                    background-color: #dcdcdc;
                    color: #898989;
                    line-height: size(64);
                    font-size: size(20);
                    &:hover{
                        background-color: $back;
                    }
                }
            }
        }

        .groupresou{
            @include web(715,52);
            margin-top: size(30);
            display: flex;
            justify-content:space-between;
        .preferential{
                display: flex;
                align-items: center;
            img{
                width: size(32);
                height: size(47);
            }
            span{
                font-size: size(30);
                margin-left: size(10);
            }
        }
            .imggengduo{
                display: flex;
                align-items: center;
                span{
                    font-size: size(24);
                    margin-right: size(10);
                }
                img{
                    width: size(25);
                    height: size(26);
                }
            }   
        }

        .imgquanbu{ 
            @include web(710,360);
            display: flex;

        .img_ges{
            width: size(280);
            height: size(352);
            }
        .imgeighteen{
            width: size(420);
            height: size(147);
            .imge_ge{
                width: 100%;
                height: 100%;
            }
        }
        .imgten{
            display: flex;
            justify-content: space-between;
        img{
            width: size(195);
            height: size(197);
            }
        }
        }

        .imggs{
            margin-top: size(20);
            text-align: center;
            img{
                width: size(228);
                height: size(200);
            }
        }
    }
}